import React, { useRef, useEffect,useState,createContext,useContext} from 'react';
// 不需要写在组件中
const MyContext = createContext(null)

function Bpp(){
    const data = useContext(MyContext)
    console.log('bpp-data',data)
    const change = ()=>{
        data.setName('修改后变成了哈哈哈哈')
    }
    return (
        <>
        <button onClick={change}>修改值</button>
        <Cpp />
        </>
    )
}
function Cpp(){
    // 接收
    const data = useContext(MyContext)
    console.log('data',data);
    
    return (
        <h1>Cpp-{data.name}</h1>
    )
}


function App(){
    const [name,setName] = useState('我是App传来的值')
    return (
        <MyContext.Provider value={
            {
                name,
                setName
            }
        }>
            <div className='App'><Bpp /></div>
        </MyContext.Provider>
    )
}

export default App